@charset "utf-8";

/*公共样式*/

.cont {
	width: 1226px;
	margin: 0 auto;
}


/*头部导航栏*/

.head-top {
	width: 100%;
	height: 40px;
	background: #333333;
	line-height: 40px;
	min-width: 1226px;
}

.head-top a {
	font-size: 12px;
	color: #b0b0b0;
}

.head-top a:hover {
	color: #fff;
}

.sep {
	color: #424242;
	font-size: 12px;
}

.shop {
	margin-left: 25px;
	text-align: center;
}

.shop a {
	display: block;
	height: 40px;
	width: 120px;
	background: #424242;
}

.shop a:hover {
	color: #FB6500;
	background-color: #FFFFFF;
}

#shop {
	position: relative;
}


/*购物车隐藏区域*/

#shop-ri {
	width: 320px;
	height: 90px;
	text-align: center;
	line-height: 90px;
	position: absolute;
	right: 1px;
	display: none;
	border: 1px solid #EDEDED;
	box-shadow: 0 1px 10px #EDEDED;
	background: #FFFFFF;
}

#shop-ri p {
	font-size: 12px;
	color: #424242;
}


/*二级导航*/

.site-header {
	height: 55px;
	width: 100%;
	min-width: 1226px;
	padding: 22px 0 23px 0;
}

.header-logo {
	display: inline-block;
}

.header-nav {
	display: inline-block;
	line-height: 55px;
	padding-left: 190px;
}

.header-nav li {
	float: left;
}

.header-nav a {
	font-size: 16px;
	color: #333333;
	padding-right: 20px;
}

.header-nav a:hover {
	color: #FF6700;
}

#sea1 {
	width: 243px;
	height: 50px;
	float: left;
	border-right: 1px solid #e0e0e0;
	padding-left: 10px;
	box-sizing: border-box;
}

.header-search form {
	border: 1px solid #e0e0e0;
}

.header-search form:hover {
	border: 1px solid #b0b0b0;
}

#sea1:hover {
	border-right: 1px solid #b0b0b0;
}

#sea2 {
	width: 50px;
	height: 50px;
	border-left: none;
}

#sea2:hover {
	background: #ff6700;
}

.header-hide {
	width: 100%;
	height: 229px;
	border-top: 1px solid #e0e0e0;
	border-bottom: 1px solid #e0e0e0;
	display: none;
	box-shadow: 0px 3px 5px #e0e0e0;
	position: absolute;
	background: #FFFFFF;
	z-index: 10;
}

.header-hide ul {
	display: none;
}

.header-hide li {
	float: left;
	width: 203px;
	height: 100px;
	margin: 35px 0 0 0;
	text-align: center;
	font-size: 12px;
	border-right: 1px solid #e0e0e0;
}

.header-hide li:last-child {
	border-right: none;
}

.hide-h {
	margin-top: 10px;
}

.hide-h a {
	color: #373737;
}

.hide-h p {
	color: #ff791f;
}

.content {
	width: 1226px;
	height: 460px;
	position: relative;
}

.content .pic a {
	position: absolute;
	top: 0;
	left: 0;
	display: none;
}

.content .indicator {
	position: absolute;
	right: 35px;
	bottom: 25px;
}

.content .indicator span {
	display: inline-block;
	width: 10px;
	height: 10px;
	margin-right: 10px;
	background-color: #65808c;
	border-radius: 50%;
	cursor: pointer;
	box-sizing: border-box;
	border: 1px solid #93a5ae;
}

.content .indicator span.active {
	background-color: #cbe4f2;
	border: 1px solid #7e8f98;
}

.content .page {
	position: absolute;
	right: 0;
	top: 200px;
}

.content .page span {
	width: 41px;
	height: 69px;
	display: inline-block;
	cursor: pointer;
	background-image: url(../img/icon-slides.png);
	background-repeat: no-repeat;
}

.prev {
	background-position: -85px 0;
	margin-right: 905px;
}

.next {
	background-position: -125px 0;
}

.prev:hover {
	background-position: 0 0;
}

.next:hover {
	background-position: -42px 0;
}

.site-category {
	position: absolute;
	z-index: 9;
	width: 234px;
	height: 420px;
	background: rgba(0, 0, 0, 0.6);
	padding: 20px 0;
	font-size: 14px;
}

.site-li {
	line-height: 42px;
	width: 100%;
	padding-left: 30px;
	box-sizing: border-box;
}

.site-li:hover {
	background: #ff6700;
}

.site-li i {
	color: #a5acaf;
	position: relative;
	float: right;
	top: 13px;
	right: 15px;
}

.site-li a {
	color: #fff;
}

.category-item {
	display: none;
	position: absolute;
	left: 234px;
	top: 0;
	width: 300%;
	height: 458px;
	border: 1px solid #e0e0e0;
	border-left: 0;
	background: #fff;
	-webkit-box-shadow: 0 8px 16px rgba(0, 0, 0, 0.18);
	box-shadow: 0 8px 16px rgba(0, 0, 0, 0.18);
}

.category-item ul li {
	width: 220px;
	height: 80px;
	float: left;
	line-height: 20px;
	padding-left: 10px;
}

.category-item ul li img {
	position: relative;
	top: 15px;
	margin-right: 10px;
}

.category-item ul li a {
	color: #ce7536;
	display: inline-block;
	width: 60px;
	height: 20px;
	border: 1px solid #ce7536;
	text-align: center;
	margin-left: 30px;
}

.home-channel {
	width: 234px;
	height: 170px;
	background-color: #5f5750;
	text-align: center;
	font-size: 12px;
	display: inline-block;
}

.home {
	margin-top: 14px;
}

.home-channel-list li {
	float: left;
	width: 78px;
	height: 84px;
}

.home-channel-list li a {
	color: #cdcac8;
	display: block;
	padding-top: 18px;
}

.home-channel-list li a:hover {
	color: #fff;
}

.home-channel-list li i {
	display: block;
height: 24px;
margin-bottom: 4px;
font-size: 24px;
line-height: 24px;
}

.home-promo {
	display: inline-block;
}

.home-promo-list li {
	float: left;
	width: 316px;
	height: 170px;
	margin-left: 13px;
}

.home-promo-list li img {
	width: 316px;
	height: 170px;
}


/*明星单品*/

.sku {
	margin: 40px 0 42px 0;
}

.box-hd {
	width: 100%;
}

.box-hd h2 {
	font-weight: 100;
	font-size: 22px;
	font-weight: 200;
	color: #333;
	float: left;
}

.xm-controls {
	float: right;
}

.xm-controls a {
	display: inline-block;
	width: 34px;
	height: 22px;
	text-align: center;
	color: #b0b0b0;
	line-height: 22px;
	border: 1px solid #e0e0e0;
	float: left;
	margin-top: 4px;
}

.xm-controls a:hover {
	color: #FF6700;
}

.box-bd {
	width: 1226px;
	height: 342px;
	overflow: hidden;
}

.xm-carousel-list {
	width: 2500px;
	position: relative;
}

.xm-carousel-list li {
	float: left;
	width: 236px;
	height: 342px;
	text-align: center;
	padding-top: 39px;
	background-color: #fafafa;
	box-sizing: border-box;
	margin-left: 12px;
}

.xm-carousel-list li:first-child {
	margin-left: 0px;
}

.xm-carousel-list li img {
	width: 160px;
	height: 160px;
}

.title {
	font-size: 14px;
	font-weight: 400;
	white-space: nowrap;
	margin-bottom: 10px;
}

.title a {
	color: #212121;
}

.desc {
	height: 18px;
	margin: 0 20px 12px;
	font-size: 12px;
	text-overflow: ellipsis;
	white-space: nowrap;
	overflow: hidden;
	color: #b0b0b0;
}

.price {
	color: #ff6709;
	font-size: 14px;
}

.aptitude {
	margin-bottom: 20px;
}

.aptitude-hd {
	margin-bottom: 20px;
}

.aptitude-hd h2 {
	font-weight: 100;
	font-size: 22px;
	font-weight: 200;
	color: #333;
	float: left;
}

.aptitude-controls {
	float: right;
}

.aptitude-controls a {
	font-size: 16px;
	color: #424242;
}

.aptitude-controls a:hover {
	color: #ff6700;
}

.aptitude-bd {
	width: 100%;
	height: 614px;
}

.aptitude-bd li:hover {
	z-index: 2;
	box-shadow: 0 15px 30px rgba(0, 0, 0, 0.1);
	transform: translate3d(0, -2px, 0);
}

.aptitude-bd-left {
	display: inline-block;
	width: 234px;
	height: 614px;
}

.aptitude-bd-right {
	display: inline-block;
	width: 992px;
}

.aptitude-bd-right li {
	float: left;
	width: 234px;
	height: 300px;
	text-align: center;
	background: #fff;
	margin-left: 14px;
	margin-bottom: 14px;
	padding: 20px 0;
	box-sizing: border-box;
}

.aptitude-bd-right li img {
	width: 160px;
	height: 160px;
}


/*搭配  周边  配件 公共样式*/

.Public {
	margin-bottom: 20px;
}

.Public-title {
	height: 58px;
	padding-top: 20px;
	box-sizing: border-box;
}

.Public-title h2 {
	font-size: 22px;
	font-weight: 200;
	color: #333;
	float: left;
}

.Public-tab {
	float: right;
}

.Public-tab li {
	float: left;
	margin-left: 30px;
	cursor: pointer;
}

.Public-tab li:hover {
	color: #ff6700;
	border-bottom: 2px solid #ff6700;
}

.Public-cont {
	height: 614px;
	width: 100%;
}

.Public-cont li:hover {
	z-index: 2;
	box-shadow: 0 15px 30px rgba(0, 0, 0, 0.1);
	transform: translate3d(0, -2px, 0);
}

.Public-left {
	height: 614px;
	width: 234px;
}

.Public-left li {
	width: 234px;
	height: 300px;
}

.Public-left li img {
	width: 234px;
	height: 300px;
}

.Public-right {
	width: 992px;
	height: 614px;
}

.Public-right li {
	float: left;
	width: 234px;
	height: 300px;
	text-align: center;
	background: #fff;
	margin-left: 14px;
	margin-bottom: 14px;
	padding: 20px 0;
	box-sizing: border-box;
	font-size: 14px;
}

.Public-right li img {
	margin-bottom: 18px;
	width: 150px;
	height: 150px;
}

.Public-right li h3 {
	font-size: 14px;
	font-weight: 400;
	margin-bottom: 10px;
}

.Public-right h3 a {
	color: #333;
}

.orange {
	color: #ff6700;
}

.gray {
	color: #b0b0b0;
	font-size: 12px;
	margin-top: 10px;
}

.Public-right .Public-li-s {
	width: 234px;
	height: 143px;
	margin: 0 0 14px 14px;
	position: relative;
}

.Public-right .Public-li-s img {
	width: 80px;
	height: 80px;
}

.Public-right .Public-li-m {
	width: 234px;
	height: 143px;
	margin: 0 0 0 14px;
	position: relative;
}

.Public-right .Public-li-m img {
	width: 80px;
	height: 80px;
}

.figure-img {
	position: absolute;
	right: 20px;
	top: 32px;
	width: 80px;
	height: 80px;
}

.figure-title {
	position: absolute;
	left: 30px;
	top: 45px;
}

.figure-title h2 {
	font-size: 18px;
	color: #333;
	font-weight: 100;
}

.figure-title h2 a {
	color: #333;
}

.xm-carousel-box-bd li {
	background: #fff;
}

.xm-carousel-box-bd li:hover {
	z-index: 2;
	box-shadow: 0 15px 30px rgba(0, 0, 0, 0.1);
	transform: translate3d(0, -2px, 0);
}

.buzz {
	width: 1226px;
	height: 415px;
}

.buzz li {
	float: left;
	width: 296px;
	height: 415px;
	background: #fff;
	margin-left: 14px;
}

.buzz li:nth-child(1) {
	margin-left: 0;
}

.buzz li:hover {
	z-index: 2;
	box-shadow: 0 15px 30px rgba(0, 0, 0, 0.1);
	transform: translate3d(0, -2px, 0);
}

.buzz li img {
	width: 296px;
	height: 220px;
	margin-bottom: 28px;
}

.review {
	height: 72px;
	margin: 0 28px 22px;
	font-size: 14px;
	line-height: 24px;
	font-weight: 400;
}

.author {
	color: #b0b0b0;
	font-size: 12px;
	margin: 0 28px 8px;
}

.info {
	margin: 0 30px;
}

.info h3 {
	display: inline-block;
	font-size: 14px;
	font-weight: 400;
}

.info span {
	color: #e0e0e0;
	font-size: 14px;
}

.info p {
	display: inline-block;
	color: #ff6700;
	font-size: 14px;
}

.conten {
	width: 1226px;
	height: 420px;
}

.content-list>li {
	width: 296px;
	height: 419px;
	float: left;
	text-align: center;
	background: #fff;
	margin-left: 14px;
	position: relative;
}

.content-list li:nth-child(1) {
	margin-left: 0px;
}
.content-list>li:hover{
	z-index: 2;
	box-shadow: 0 15px 30px rgba(0, 0, 0, 0.1);
	transform: translate3d(0, -2px, 0);
}
.content-list li h2 {
	margin-top: 45px;
	margin-bottom: 18px;
	font-size: 16px;
	font-weight: 400;
}

.item-list-ul h4 {
	font-size: 20px;
	font-weight: 400;
	line-height: 1.25;
	margin: 0 20px 5px;
}

.descs {
	font-size: 12px;
	height: 40px;
	line-height: 20px;
	color: #b0b0b0;
	margin: 0 48px 10px;
}

.prices {
	margin: 0 10px 15px;
	color: #333;
	font-size: 14px;
	height: 21px;
}
.xm-pagers-wrapper{
	position: absolute;
bottom: 15px;
left: 0;
width: 296px;
}
.xm-pagers-wrapper ul{
	width: 120px;
	margin: 0 auto;
}
.xm-pagers-wrapper li{
	float: left;
	padding: 10px;
}
.xm-pagers-wrapper  span{
	display: inline-block;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background-color: #b0b0b0;
	border: 2px solid #FFFFFF;
	cursor: pointer;
}
.xm-pagers-wrapper  span:hover{
	background: #ff6700;
} 
.pager-active span{
	background-color: #FFFFFF;
	border: 2px solid #ff6700;
	cursor: default;
}
.pager-active span:hover{
	background-color: #FFFFFF;
}
.video-hd{
	width: 1226px;
	height: 58px;
	position: relative;
	line-height: 58px;
}
.video-hd h2{
	font-size: 22px;
font-weight: 200;
line-height: 58px;
color: #333;
}
.video-hd-right{
	position: absolute;
top: 0;
right: 0;
}
.video-hd-right a{
	font-size: 16px;
    color: #424242;
}
.video-hd-right a i{
	display: inline-block;
	width: 12px;
height: 12px;
padding: 4px;
margin-left: 8px;
border-radius: 16px;
font-size: 16px;
line-height: 12px;
background: #b0b0b0;
color: #fff;
vertical-align: 1px;
text-align: center;
}
.video-db{
	width: 1226px;
    height: 285px;
    padding-bottom: 60px;
}
.video-db li{
float: left;
width: 296px;
height: 285px;
margin-left: 14px;
text-align: center;
background: #fff;
}
.video-db li:hover{
	z-index: 2;
	box-shadow: 0 15px 30px rgba(0, 0, 0, 0.1);
	transform: translate3d(0, -2px, 0);
}
.video-db li:first-child{
	margin-left: 0;
}
.video-img{
	width: 296px;
height: 180px;
margin: 0 0 28px;
position: relative;
}
.video-img img{
	width: 296px;
    height: 180px;
} 
.video-img a i{
position: absolute;
display: inline-block;
left: 20px;
bottom: 10px;
width: 32px;
height: 20px;
border: 2px solid #fff;
border-radius: 12px;
line-height: 20px;
color: #fff;
background-color: rgba(0,0,0,0.6);
}
.video-img a i:hover{
	background-color: #ff6700;
	border: 2px solid #ff6700;
}
.video-db li h3{
	margin: 0 0 6px;
font-size: 14px;
font-weight: 400;
}
.video-db li h3 a{
	color: #333;
}
.video-db li h3 a:hover{
	color: #ff6700;
}
.video-db li p{
	    font-size: 12px;
    color: #b0b0b0;
}
.footer-service{
	padding: 27px 0;
border-bottom: 1px solid #e0e0e0;
}
.list-service li{
	float: left;
width: 19.8%;
height: 25px;
border-left: 1px solid #e0e0e0;
font-size: 16px;
line-height: 25px;
text-align: center;
}
.list-service li:first-child{
	border-left: none;
}
.list-service li a{
	color: #616161;
	
}
.list-service li a:hover{
	color:#ff6700 ;
}
.list-service li i{
	margin-right: 6px;
font-size: 24px;
line-height: 24px;
vertical-align: -4px;
}
.footer-links{
	padding: 40px 0;
}
.footer-links dl{
	float: left;
width: 160px;
height: 112px;
}
.footer-links dl dt{
    margin: -1px 0 26px;
    font-size: 14px;
    line-height: 1.25;
    color: #424242;
}
.footer-links dl dd{
	margin: 10px 0 0;
font-size: 12px;
}
.footer-links dl dd a{
	color: #757575;
}
.footer-links dl dd a:hover{
	color:#ff6700 ;
}
.footer-links-right{
	float: right;
width: 251px;
height: 112px;
border-left: 1px solid #e0e0e0;
text-align: center;
color: #616161;
}
.footer-links-right p:first-child{
	margin: 0 0 5px;
font-size: 22px;
line-height: 1;
color: #ff6700
}
.footer-links-right p:nth-child(2){
	margin: 0 0 16px;
font-size: 12px;
}
.footer-links-right a{
	display: inline-block;
	width: 118px;
height: 28px;
font-size: 12px;
line-height: 28px;
color: #ff6700;
border: 1px solid #ff6700;
}
.footer-links-right a:hover{
	background: #ff6700;
	color: #fff;
}
.site-info{
	padding: 30px 0;
font-size: 12px;
background: #fafafa;
}
.logo-ir{
	float: left;
width: 57px;
height: 57px;
margin-right: 10px;
background: url(../img/logo-footer.png) no-repeat 50% 50%;
}

.info-text{
	float: left;
	color: #b0b0b0;
	font-size: 12px;
}
.info-text a:hover{
	color: #ff6700;
}
.info-text a{
	color: #b0b0b0;
}
.info-sites a{
	color: #757575;
}
.info-links{
	float: right;
height: 28px;
margin: 4px 0 0;
}
.info-links img{
	width: auto;
height: 28px;
margin-left: 7px;
}
.slogan-ir{
	clear: both;
margin: 30px auto 0;
width: 267px;
height: 19px;
background: url(../img/slogan2016.png) no-repeat center 0;
text-indent: -9999em;
}
